<script>
import ProList from '@/components/ProList'
import axios from 'axios'


export default {
    data() {
        return {
            count: 100,
            roomList: []
        }
    },
    methods: {
        addNum(val){
            this.count += val
        }
    },
    components: {
        ProList
    },
    mounted(){
        // console.log(axios);
        // http://open.douyucdn.cn/api/RoomApi/live

        axios.get('/api/RoomApi/live').then(res => {
            console.log(res);
            this.roomList = res.data.data
        })
    }
}
</script>

<template>
    <div>
        <img style="width: 150px" src="./zfb.png" alt="">
        <h1>你好世界 -- {{count}} </h1>
        <button @click="count++"> 加 1 </button>
        <button @click="addNum(10)"> 加指定数 </button>
        <hr>
        <ProList />

        <hr>

        <ul>
            <li v-for="item in roomList" :key="item.room_id">
                <img :src="item.room_src" alt="">
                <span> {{item.room_name}} </span>
            </li>
        </ul>


    </div>
</template>
